<template>
  <div>
    <Header />
    <div v-for="soc in sosos">
      <div>{{ soc.nickname }}</div>
      <img :src="soc.avatarUrl" alt="" />
      <p>{{ soc.signature }}</p>
      <span>{{ soc.signature }}</span>
    </div>

    <!-- 名字 -->
    <button @click="getUser">获取用户信息</button>
    <Footer />
  </div>
</template>

<script>
import Header from '../components/Header'
import Footer from '../components/Footer'

export default {
  name: 'UserCont',
  data() {
    return {
      sosos: [],
    }
  },

  components: {
    Header,
    Footer,
  },

  computed: {},

  methods: {
    getUser() {
      this.$axios
        .get(
          `http://localhost:3000/login?email=2801772839@qq.com&password=15035303749`
        )
        .then(res => {
          console.log('获取成功', res.data.profile)
          this.$bus.$emit('getUser', res.data.profile)
        })
    },
  },
  mounted() {
    //华语歌手
    this.$bus.$on('getUser', sosos => {
      console.log('我是用户信息组件 收到了数据:', sosos)
      this.sosos = sosos
    })
  },
}
</script>
<style lang="css" scoped></style>
